<template>
	<div id="myFans">
		<div id="header">
			<img src="../../static/img/return.png" @click="$router.go(-1)"/>
			<p>我的粉丝({{fans.length}})</p>
		</div>
		<div class="myFans_title">
			<p>粉丝昵称</p>
			<p>粉丝状态</p>
			<p>奖励</p>
		</div>
		<div class="myFans_item" v-for="item in fans">
			<p>{{item.username}}</p>
			<p>{{item.status==1?'已完成首单':'已注册'}}</p>
			<p>{{item.money}}元现金</p>
		</div>
	</div>
</template>

<script>
export default{
	name: 'myFans',
	data: function(){
		return {
			fans: [], // 我的粉丝列表
		}
	},
	methods:{
		// 获取我的粉丝列表
		getMyFans: function(){
			var _this = this;
			let postData = _this.$qs.stringify({
				type: 0
			});
			_this.$axios.post("/user/extends/getMyExtends",postData).then(function(res){
				var data = res.data;
				if(data.message == "succ"){
					_this.fans = data.result;
				}else{
					console.log(data.result);
				}
			}).catch(function(err){
				console.log(err);
			});
		},
		//--------日期转换-----------
		getDate: function(str){  
			if(str == ""||str ==null){
				return "";
			}
		    var oDate = new Date(str),  
		    oYear = oDate.getFullYear(),  
		    oMonth = oDate.getMonth()+1,  
		    oDay = oDate.getDate(),  
		    oTime = oYear +'-'+ this.getzf(oMonth) +'-'+ this.getzf(oDay);//最后拼接时间  
		    return oTime;  
		},
		//补0操作  
		getzf:function(num){  
		    if(parseInt(num) < 10){  
		        num = '0'+num;  
		    }  
		    return num;  
		},
	},
	created: function(){
		this.getMyFans();
	}
}
</script>

<style scoped>
/* ========== */
/* = Header = */
/* ========== */
#header{
	width: 100%;
	background-color: #fff;
	position: fixed;
	top: 0;
	left: 0;
	height: 4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 1px solid #EEEEEE;
	font-size: 1.6rem;
	color: #4F4F4F;
	box-sizing: border-box;
	z-index: 10;
}
#header img{
	height: 2rem;
	display: block;
	position: absolute;
	top: 1rem;
	left: 2rem;
}
#myFans{
	padding-top: 8rem;
	box-sizing: border-box;
}
.myFans_title{
	position: fixed;
	top: 4rem;
	display: flex;
	align-items: center;
	height: 3rem;
	width: 100%;
	background-color: #fff;
}
.myFans_title p{
	width: 34%;
	text-align: center;
	height: 2rem;
	line-height: 2rem;
	border-right: 1px solid #EEEEEE;
	color: #787878;
	font-size: 1.2rem;
}
.myFans_item{
	display: flex;
	align-items: center;
	height: 3rem;
	background-color: #fff;
	border-bottom: 1px solid #EEEEEE;
}
.myFans_item p{
	width: 34%;
	font-size: 1.2rem;
	color: #787878;
	text-align: center;
}
</style>